<template>
  <uni-popup ref="confirm" type="bottom">
	<view class="flex flex-column align-center justify-center " style="background-color: #fff;border-radius: 10rpx;">
		<block v-for="(item,index) in menus" :key="index">
			<view @click="event(item)" class="flex flex-row align-center justify-center py-3 " :class="{'border-bottom':index != menus.length-1}" style="width: 720rpx;">
				<em-icon v-if="item.iconUnicode" style="font-size: 18px;color: #4C4C4C;font-weight: bold;" :unicode="item.iconUnicode"></em-icon>
				<text style="font-size: 16px;color: #4C4C4C;margin-left: 5rpx;font-weight: bold;">{{item.name}}</text>
			</view>
		</block>
		<view style="background: #F0F1F5;width: 750rpx;height: 20rpx;"></view>
		<view @click="close()" class="flex flex-row align-center justify-center py-3 border-bottom" style="width: 720rpx;">
			<text style="font-size: 16px;color: #4C4C4C;margin-left: 5rpx;font-weight: bold;">取消</text>
		</view>
	</view>	
  </uni-popup>
</template>

<script>

  let app = {}
  // #ifdef MP-WEIXIN
  app = getApp({
    allowDefault: true
  }).$vm
  // #endif
  // #ifndef MP-WEIXIN
  app = getApp({
    allowDefault: true
  })
  // #endif
  let timer = null
  export default {
    name: 'em-header',
    props: {
    },
    data() {
      return {
        styles: {},
		confirm:null,
		menus:[],
		title:"",
      }
    },
    watch: {
    },
    methods: {
	  open({confirm,menus}){
		let _this = this
		this.menus = menus
		this.$refs.confirm.open()
		this.confirm = confirm
		console.log("menus",menus)
	  },
	  event(e){
		 console.log("event",e) 
		 e.event && e.event()
	  },
	  onConfirm(){
		this.close()
		this.confirm&&this.confirm() 
	  },
	  close(){
		 this.$refs.confirm.close() 
	  },
    }
  }
</script>

<style>
.camera-icon{
	padding: 60rpx;
	border-radius: 30rpx;
	font-size: 32px;
}
.border-bottom{
	border-bottom-width: 1px;
	border-style: solid;
	border-color: #EBEBEB;
}
</style>
